<template>
    <div>
      <div class="box">
          <div class="dv">
              <div  class="dv1" v-for="(v,index) in arr" :key="index">
                      <img :src="v.src" alt="">
                      <p>{{v.txts}}</p> 
              </div>
          </div>
      </div>
    </div>
  </template>
  
  <script>
  export default {
      data(){
          return {
              arr:[
                  {
                      src:require("../../../assets/homlist/1.png"),
                      txts:"京东超市"
                  },
                  {
                      src:require("../../../assets/homlist/2.png"),
                      txts:"数码电器"
                  },
                  {
                      src:require("../../../assets/homlist/3.png"),
                      txts:"京东新百货"
                  },
                  {
                      src:require("../../../assets/homlist/4.png"),
                      txts:"京东生鲜"
                  },
                  {
                      src:require("../../../assets/homlist/5.png"),
                      txts:"京东到家"
                  },
                  
                  {
                      src:require("../../../assets/homlist/11.png"),
                      txts:"京东拍卖"
                  },
                  {
                      src:require("../../../assets/homlist/12.png"),
                      txts:"玩3C"
                  },
                  {
                      src:require("../../../assets/homlist/13.png"),
                      txts:"沃尔玛"
                  },
                  {
                      src:require("../../../assets/homlist/14.png"),
                      txts:"美妆馆"
                  },
                  {
                      src:require("../../../assets/homlist/15.png"),
                      txts:"京东旅行"
                  },
                  {
                      src:require("../../../assets/homlist/6.png"),
                      txts:"充值缴费"
                  },
                  {
                      src:require("../../../assets/homlist/7.png"),
                      txts:"附近好店"
                  },
                  {
                      src:require("../../../assets/homlist/8.png"),
                      txts:"领券"
                  },
                  {
                      src:require("../../../assets/homlist/9.png"),
                      txts:"PLUS会员"
                  },
                  {
                      src:require("../../../assets/homlist/10.png"),
                      txts:"京东国际"
                  },
                  {
                      src:require("../../../assets/homlist/16.png"),
                      txts:"拍拍二手"
                  },
                  {
                      src:require("../../../assets/homlist/17.png"),
                      txts:"全部"
                  },
              ]
          }
      }
  }
  </script>
  
  <style scoped>
  * {
      margin: 0;
      padding: 0;
  }
      ::-webkit-scrollbar { 
          display: none;
      }
      .box {
          width: 100%;
          height: 162px;
          background-color: #eee;
          overflow: auto;
      }
      .dv {
          width: 200%;
          height: 162px;
          display: flex;
          flex-wrap: wrap;
          align-items: center;
      }
      .dv .dv1 {
          width: 10%;
          height: 74px;
          text-align: center;
      }
    
      .dv  img {
          width: 40px;
          height: 40px;
      }
      .dv .dv1 p {
          color: #666;
          font-size: 12px;
          height: 18px;
      }
      .box2 {
          width: 5px;
          height: 5px;
          background-color: red;
          border-radius: 50%;
          margin-left: 4px;
      }
      .bottom {
          width: 100%;
          height: 10px;
          display: flex;
          align-items: center;
          justify-content: center;
  
      }
  </style>